<!DOCTYPE html>  
<html lang="zh-CN">  
<head>  
    <meta charset="UTF-8">  
    <meta name="viewport" content="width=device-width, initial-scale=1.0">  
    <title>展会活动页面设计</title>  
    <style>  
        body {  
            display: flex;  
            justify-content: center;  
            align-items: center;  
            height: 100vh;  
            margin: 0;  
            background-color: #f4f4f4;  
        }  
        .news {  
            margin: 0 auto; /* 水平居中news */  
            width: 80%;  
            text-align: center;  
        }  
        .image-container {  
            position: relative;  
            width: 100%;  
            max-width: 600px;  
        }  
        .image-container img {  
            width: 100%;  
            height: auto;  
            display: block;  
        }  
        .event-text {  
            position: absolute;  
            top: 10px;  
            right: 10px; /* 右上角定位 */  
            display: flex;  
            align-items: center;  
            justify-content: center;  
            background-color: rgba(0, 0, 0, 0.5);  
            color: white;  
            padding: 5px 10px;  
            border-radius: 5px;  
        }  
    </style>  
</head>  
<body>  
    <div class="news">  
        <div class="image-container">  
            <img src="./图片/图片1.png" alt="展会活动背景图">  
            <span class="event-text">展会活动</span>  
        </div>  
    </div>  
</body>  
</html>